@extends('layouts.root')

@section('title', 'Index')

@section('css')
    <style>
        p{margin-bottom: 5px}
    </style>
@endsection

@section('content')
    <div class="container">
        <div class="nav navbar-fixed-top " style="background-color: #2aabd2">
            <h6 class="text-center">Search Record</h6>
        </div>
        <div class="col-lg-12" style="margin-top: 50px">
            <img src="/uploads/img/201705/c165dd531a428ab3f6fc972d77f0278d.jpg" height="100px" class="img-thumbnail">
            <form class="form-group" method="get" action="{{url('/index')}}" style="margin-top: 10px">
                <input class="form-control" value="{{$q or ''}}" name="q" type="text"
                       placeholder="Input Content" style="padding-right: 55px">
                <button class="btn pull-right"
                        type="submit"
                        style="
                                    margin-top: -28px;
                                    background-color: #f5f8fa;
                                    box-shadow: none;
                                    border-radius: 0;
                                    border: none;
                                    border-left: 1px solid #dddddd;"
                >
                    <span class="glyphicon glyphicon-search"></span>
                </button>
            </form>
        </div>
        <div class="col-lg-12">
            @if (!empty($records))
                @foreach($records as $record)
                    <a href="{{url('/record/' . $record->id)}}">
                        <div style="width: 100%;margin-bottom: 10px;border-bottom: 1px solid #dddddd;padding-bottom: 10px" class="pull-left">
                            <div style="display: inline-block;width: 50%" class="pull-left">
                                @if (!empty($record->images))
                                    <?php $index = 0?>
                                    @foreach(json_decode($record->images) as $image)
                                        @if ($index == 0)
                                        <img src="{{ $image }}" width="100%" class="img-rounded" style="max-height: 120px">
                                        @endif
                                        <?php $index++?>
                                    @endforeach
                                @else
                                    <img src="" width="100%" style="max-height: 120px">
                                @endif
                            </div>
                            <div style="display: inline-block;width: 48%" class="pull-right">
                                <p class="text-right">Name:{{$record->name}}</p>
                                <p class="text-right">SN:{{$record->name}}</p>
                                <p class="text-right">Date:{{date( 'Y-m-d', strtotime($record->date))}}</p>
                            </div>
                        </div>
                    </a>
                @endforeach
                <div class="text-center">
                    {{$records->appends(['q' => $q])->links()}}
                </div>
            @endif
        </div>
    </div>
@endsection